<template>
	<div id="">
		<mt-popup v-if="popShow" v-model="popShow">
			<weixin-login v-if="isLoad == 'weixinLogin'"></weixin-login>
			<div v-else-if="isLoad == 'phoneLogin'">
				<phone-login v-if="userPhoneCode" @userPhoneCodeChoose="userPhoneCodeChoose"></phone-login>
				<username-login v-else @userPhoneCodeChoose="userPhoneCodeChoose"></username-login>
			</div>
		</mt-popup>
	</div>

</template>

<script>
	import { mapGetters, mapState, mapActions } from 'vuex';
	import weixinLogin from "@/components/login-model/weixin-login/weixin-login"
	import phoneLogin from "@/components/login-model/phone-login/phone-login"
	import usernameLogin from "@/components/login-model/username-login/username-login"

	export default {
		data() {
			return {
				weixinDetail: null,
				isShowShareCome: false,
				isOldUser: false,
				popShow: false,
				userPhoneCode: true
			}
		},
		computed: {
			...mapGetters(['login']),
			...mapState(['userInfo', 'isLoad'])
		},
		mounted() {
//			if(this.isLoad) {
//				if(this.isLoad == 'loaded') {
//					this.popShow = false;
//				} else {
//					this.popShow = true;
//				}
//			} else {
//				this.popShow = false;
//			}
		},
		methods: {
			userPhoneCodeChoose(val) {
				this.userPhoneCode = val;
			}
		},
		components: {
			"weixin-login": weixinLogin,
			"phone-login": phoneLogin,
			"username-login": usernameLogin
		},
		watch: {
			isLoad(val, newVal) {
				if(this.isLoad) {
					if(this.isLoad == 'loaded') {
						this.popShow = false;
					} else {
						this.popShow = true;
					}
				} else {
					this.popShow = false;
				}
			},
			popShow(val,newVal){
				if(val == false){
					this.$store.state.isLoad = null
				}
			}
		}
	}
</script>

<style>

</style>